@import '~themes/vars';

.weather {
  color: #fff;
  height: 204px;
  padding: 24px;
  justify-content: space-between;
  display: flex;
  font-size: 14px;

  .left {
    display: flex;
    flex-direction: column;
    width: 64px;
    padding-top: 55px;

    .icon {
      width: 64px;
      height: 64px;
      background-position: center;
      background-size: contain;
    }

    p {
      margin-top: 16px;
    }
  }

  .right {
    display: flex;
    flex-direction: column;
    width: 50%;

    .temperature {
      font-size: 36px;
      text-align: right;
      height: 64px;
      color: #fff;
    }

    .description {
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      text-align: right;
    }
  }
}
